<template>
	<div class="record-plane">
		<div class="opers flex v-c">
  			<el-form :inline="true" class="filter-blk flex-1">
				<el-form-item label="分区">
					<el-select v-model="filterForm.partition" placeholder="请选择" clearable @change="partitionChange">
				      	<el-option :label="item.name" :value="item.id" v-for="(item, key) in partitionList" :key="key"></el-option>
				    </el-select>
				</el-form-item>
				<el-form-item label="分区位置">
					<el-select v-model="filterForm.seat" placeholder="请选择" clearable @change="seatChange">
				      	<el-option :label="item.name" :value="item.id" v-for="(item, key) in seatList" :key="key"></el-option>
				    </el-select>
				</el-form-item>
			</el-form>
  		</div>
  		<el-table
  			class="mt-20"
			:data="dataList" 
			style="width: 100%"
			v-loading="loading">
		    <el-table-column prop="typeName" label="巡检点类型"></el-table-column>
		    <el-table-column prop="partitionName" label="所在分区"></el-table-column>
		    <el-table-column prop="seatName" label="具体位置"></el-table-column>
		    <el-table-column prop="addr" label="详细地址"></el-table-column>
		    <el-table-column prop="rfid" label="RFID码"></el-table-column>
		</el-table>
		<el-pagination
			v-if="total>0"
			class="text-right mt-20 mr-20"
	      	@current-change="handleCurrentChange"
	      	:current-page="currentPage"
	      	:page-size="pageSize"
	      	layout="prev, pager, next, total, jumper"
	      	:total="total">
	    </el-pagination>
	</div>
</template>
<script>
export default {
	name: 'recordPlan',
	props: {
		id: {
			type: String,
			default: "",
		}
	},
	computed: {},
	watch: {},
	data () {
		return {
			filterForm: {
				createyear: ''+(new Date()).getFullYear()
			},
			partitionList: [],
			seatList: [],
			total: 0,
			loading: false,
			currentPage:1,
			pageSize: 10,
			dataList:[],
		}
	},
	methods: {
		getData (page) {
			this.loading = true
			let params = Object.assign({
				page: page,
				limit: this.pageSize,
				businessId: this.id
			},this.filterForm)
			this.$get('/check/checkaddr/checkaddrListPage', params).then(res => {
				this.loading = false
            	this.dataList = res.data.Items
            	this.total = res.data.totalSize
            	this.currentPage = page
            }, (err) =>{
            	// 
            })
		},
		getPartition () {
			this.$get('/check/businessPartition/businessPartitionList', {
            	businessId: this.id
            }).then(res => {
            	this.partitionList = res.data.Items
            }, (err) =>{
            	// 
            })
		},
		getSeat (partitionId) {
			this.$get('/check/businessSeat/businessSeatListPage', {
				businessId: this.id,
				partitionId:partitionId
            }).then(res => {
            	this.seatList = res.data.Items
            }, (err) =>{
            	// 
            })
		},
		partitionChange (value) {
			this.$set(this.filterForm,'seat','')
			if(value==''){
				this.seatList = []
			}else{
				this.getSeat(value)
			}
			this.getData(1)
			
		},
		seatChange (value) {
			this.getData(1)
		},
		handleCurrentChange (page) {
			this.getData(page)
		}
	},
	created () {
		this.getData(1)
		this.getPartition()
		this.getSeat()
	}
}
</script>